<template>
  <div>
    <h1>App</h1>
    <div :style="{ display: 'flex', justifyContent: 'space-around' }">
      <!-- 
        如果想要给组件内部的插槽填充结构,则直接在组件标签的内部书写结构即可

       -->
      <Content :type="'logo'">
        <img src="http://www.atguigu.com/images/index_new/logo.png" alt="" />
      </Content>
      <Content :type="'列表'">
        <ul>
          <li>1</li>
          <li>2</li>
          <li>3</li>
        </ul>
      </Content>
      <Content :type="'输入'">
        <input type="text" /> <br />
        <input type="text" /> <br />
        <input type="text" /> <br />
      </Content>
    </div>
  </div>
</template>

<script>
import Content from "@/components/Content";
export default {
  name: "App",
  components: {
    Content,
  },
};
</script>

<style></style>
